<template>
    <view>
        <view class="demos-header">
            <h1 class="demos-title">
                <view class="logo">
                    <u--image class="img" :src="src" mode="widthFix" @click="click" :fade="false" width="250px"></u--image>
                </view>
            </h1>
        </view>
        <view class="bg-bar"></view>

        <view class="content">
            <view class="weui-cells title-bar">
                <svg
                    t="1618655711531"
                    class="icon"
                    viewBox="0 0 1024 1024"
                    version="1.1"
                    xmlns="http://www.w3.org/2000/svg"
                    p-id="1849"
                    width="24"
                    height="24"
                >
                    <path
                        d="M384 216h264v-52.4c0-24.08 19.528-43.6 44-43.6 24.304 0 44 19.84 44 43.6V216h136c17.68 0 32 15.208 32 33.976v620.048c0 18.768-14.32 33.976-32 33.976H152c-17.68 0-32-15.208-32-33.976V249.976C120 231.2 134.32 216 152 216h144v-52.4c0-24.08 19.528-43.6 44-43.6 24.304 0 44 19.84 44 43.6V216z m0 72v52.4c0 24.08-19.528 43.6-44 43.6-24.304 0-44-19.84-44-43.6V288H184v552h656V288H736v52.4c0 24.08-19.528 43.6-44 43.6-24.304 0-44-19.84-44-43.6V288H384zM296 494.208C296 481.944 305.416 472 318.208 472h43.584C374.056 472 384 481.416 384 494.208v43.584C384 550.056 374.584 560 361.792 560h-43.584C305.944 560 296 550.584 296 537.792v-43.584z m176 0C472 481.944 481.416 472 494.208 472h43.584C550.056 472 560 481.416 560 494.208v43.584C560 550.056 550.584 560 537.792 560h-43.584C481.944 560 472 550.584 472 537.792v-43.584z m176 0C648 481.944 657.416 472 670.208 472h43.584C726.056 472 736 481.416 736 494.208v43.584C736 550.056 726.584 560 713.792 560h-43.584C657.944 560 648 550.584 648 537.792v-43.584z m-352 176C296 657.944 305.416 648 318.208 648h43.584C374.056 648 384 657.416 384 670.208v43.584C384 726.056 374.584 736 361.792 736h-43.584C305.944 736 296 726.584 296 713.792v-43.584z m176 0C472 657.944 481.416 648 494.208 648h43.584C550.056 648 560 657.416 560 670.208v43.584C560 726.056 550.584 736 537.792 736h-43.584C481.944 736 472 726.584 472 713.792v-43.584z m176 0C648 657.944 657.416 648 670.208 648h43.584C726.056 648 736 657.416 736 670.208v43.584C736 726.056 726.584 736 713.792 736h-43.584C657.944 736 648 726.584 648 713.792v-43.584z"
                        fill="#d51717"
                        p-id="1850"
                    ></path>
                </svg>
                <span class="title">生日提醒管家</span>
                <span class="tip">不再忘记重要的日子</span>
            </view>
            <view class="weui-cells">
                <u--form labelPosition="left" :model="formData" :rules="rules" labelWidth="210rpx">
                    <u-form-item label="地区:" prop="address" borderBottom >   
                        <!-- <view class="Micon">*</view> -->
                        <input v-model="formData.address" border="none" class="weui-input input-disabled" placeholder="请输入地区" disabled />
                    </u-form-item>

                    <view :class="towhoBorder? 'towhoBorder' : ''">
                        <u-form-item label="蛋糕买给谁:" prop="towho" borderBottom  :required="true">
                            <!-- <view class="Micon">*</view> -->
                            <picker mode="selector" @change="towhoChange" :value="towhoListIndex" :range="towhoList" class="picker">
                                <view :class="towhoList[towhoListIndex] == '请选择'?'pickerTextNo':'pickerText'">{{towhoList[towhoListIndex]}}
                                    <uni-icons type="bottom" size="22"></uni-icons>
                                </view>
                            </picker>
                        </u-form-item>
                    </view>

                    <u-form-item  v-if="towhoList[towhoListIndex] == '其他'" label="其他:" prop="towhoOther" borderBottom>
                        <u--input v-model="formData.towhoOther" border="none" class="weui-input" placeholder="请输入对方身份"></u--input>
                    </u-form-item>

                    <view :class="birthdayBorder? 'birthdayBorder' : ''">
                        <u-form-item label="TA的生日:" prop="birthday" borderBottom :required="true">
                            <!-- <view class="Micon">*</view> -->
                            <view class="example-body">
                                <uni-datetime-picker type="date" :value="formData.birthday" @change="birthdayChange" :border="false" :clear-icon="false"/>
                            </view>
                        </u-form-item>
                    </view>

                    <view :class="sexBorder? 'sexBorder' : ''">
                        <u-form-item label="TA的性别:" prop="sex" borderBottom :required="true">
                            <!-- <view class="Micon">*</view> -->
                                <u-radio-group :value="formData.sex" placement="row">
                                    <u-radio label="男" :name="1" value="1" @change="radioChange"></u-radio>
                                    <u-radio label="女" :name="2" value="2" @change="radioChange"></u-radio>
                                </u-radio-group>
                        </u-form-item>
                    </view>

                    <view :class="fromwhereBorder? 'fromwhereBorder' : ''">
                        <u-form-item label="从哪里听说的熊猫不走:" prop="fromwhere" borderBottom :required="true">
                            <!-- <view class="Micon">*</view> -->
                            <picker mode="selector" @change="fromwhereChange" :value="columnsIndex" :range="columns" class="picker">
                                <view :class="columns[columnsIndex] == '请选择'?'pickerTextNo':'pickerText'">{{columns[columnsIndex]}}
                                    <uni-icons type="bottom" size="22"></uni-icons>
                                </view>
                            </picker>
                        </u-form-item>
                    </view>

                    <u-form-item  v-if="columns[columnsIndex] == '其他'" label="其他:" prop="fromwhereOther" borderBottom>
                        <u--input v-model="formData.fromwhereOther" border="none" class="weui-input" placeholder="请输入途径"></u--input>
                    </u-form-item>

                    <view :class="casenameBorder? 'casenameBorder' : ''">
                        <u-form-item label="场合:" prop="casename" borderBottom  :required="true">
                            <!-- <view class="Micon">*</view> -->
                            <picker mode="selector" @change="casenameChange" :value="casenameListIndex" :range="casenameList" class="picker">
                                <view :class="casenameList[casenameListIndex] == '请选择'?'pickerTextNo':'pickerText'">{{casenameList[casenameListIndex]}}
                                    <uni-icons type="bottom" size="22"></uni-icons>
                                </view>
                            </picker>
                        </u-form-item>
                    </view>

                    <u-form-item  v-if="casenameList[casenameListIndex] == '其他'" label="其他:" prop="casenameOther" borderBottom>
                        <u--input v-model="formData.casenameOther" border="none" class="weui-input" placeholder="请输入场合"></u--input>
                    </u-form-item>
                    
                    <view :class="motiveBorder? 'motiveBorder' : ''">
                        <u-form-item label="购买理由:" prop="motive" borderBottom  :required="true">
                            <!-- <view class="Micon">*</view> -->
                            <picker mode="selector" @change="motivenChange" :value="motiveListIndex" :range="motiveList" class="picker">
                                <view :class="motiveList[motiveListIndex] == '请选择'?'pickerTextNo':'pickerText'">{{motiveList[motiveListIndex]}}
                                    <uni-icons type="bottom" size="22"></uni-icons>
                                </view>
                            </picker>
                        </u-form-item>
                    </view>

                    <u-form-item  v-if="motiveList[motiveListIndex] == '其他'" label="其他:" prop="motiveOther" borderBottom>
                        <u--input v-model="formData.motiveOther" border="none" class="weui-input" placeholder="请输入购买动机"></u--input>
                    </u-form-item>

                    
                </u--form>
                <view style="color: #d51717; padding: 5px 0px 30px 20px; font-size: 14px; ">带 * 为必填项目，请完成填写</view>
            </view>
            <view class="bottom">
                <button type="warn" @click.stop.prevent="submitInfo()">提交</button>
            </view>
        </view>
        <!-- <u-picker :show="fromwhereShow" :columns="columns" @confirm="fromwhereConfirm" @cancel="fromwhereCancel"></u-picker> -->
    </view>
</template>

<script>
import utils from "@/libs/utils/utils.js"
import QQMapWX from '@/libs/qqmap.js'

export default {
    data() {
        return {
            qqMap: new QQMapWX({key: 'FTIBZ-H6SCX-SHK4F-7XM5U-TUVW7-YVFB4',vm: this}),
            longitude:'',//经度
			latitude:'',//纬度
			address:'',//完整地名
			city:'',//城市
            baseUrl:'https://api.xiongmaodangao.com/api/xmbz-order',
            testUrl:'http://test.center.xiongmaodangao.com/api/xmbz-order',
            src: "../../static/title_img.png",
            formData: {
                //表单数据
                address: '',
                sex: 1,
                birthday: '',
                fromwhere: '朋友推荐',
                fromwhereOther: '',
                casename: '',
                casenameOther: '',
                motive: '',
                motiveOther: '',
                towho:'',
                towhoOther:'',
            },
            rules: {
                //表单验证规则
                "address": {
                    type: "string",
                    required: false,
                    message: "请填写地址",
                    trigger: ["blur", "change"],
                },
                "sex": {
                    type: "number",
                    required: true,
                    message: "请选择男或女",
                    trigger: ["blur", "change"],
                },
                "birthday": {
                    type: "string",
                    required: true,
                    min: 1,
                    message: "请选择生日日期",
                    trigger: ["blur", "change"],
                },
                "fromwhere": {
                    min:1,
                    type: "string",
                    required: true,
                    message: "请选择途径",
                    trigger: ["blur", "change"],
                },
                "casename": {
                    min:1,
                    type: "string",
                    required: true,
                    message: "请选择场合",
                    trigger: ["blur", "change"],
                },
                "motive": {
                    min:1,
                    type: "string",
                    required: true,
                    message: "请选择购买动机",
                    trigger: ["blur", "change"],
                },
                "towho": {
                    min:1,
                    type: "string",
                    required: true,
                    message: "请选择购买动机",
                    trigger: ["blur", "change"],
                },
            },
            columns: ['朋友推荐','电梯广告', '商场/学校/社区推广', '看别人订过','朋友圈广告','线上商城','外卖/团购网站','淘宝/京东','抖音/小红书','QQ','其他'],
            columnsIndex: 0,
            casenameList: ['请选择','生日', '纪念日', '节日', '婚礼', '聚会', '团建', '市场活动', '其他'],
            casenameListIndex: 0,
            motiveList: ['请选择','好玩（小熊猫跳舞）', '好吃', '健康', '仪式感', '优惠', '方便（送上门）', '有面子', '他人推荐', '其他'],
            motiveListIndex: 0,
            towhoList: ['请选择','父母', '孩子', '伴侣', '兄弟姐妹', '朋友', '师生', '同事', '自己', '其他'],
            towhoListIndex: 0,
            openId: null,
            nickName: null,
            unionId:'',
            uuid: '',
            sexBorder: false,
            birthdayBorder: false,
            fromwhereBorder: false,
            casenameBorder: false,
            motiveBorder: false,
            towhoBorder: false,
        };
    },
    onLoad() {
		this.getLL()
        this.uuid = sessionStorage.getItem("uuid");
        if (this.uuid == undefined || this.uuid == null || this.uuid === '') {
            this.uuid = this.generateUUID();
            sessionStorage.setItem('uuid', this.uuid);
        }
        let code = this.GetQueryString('code')
        if (code == null) {
            
            this.openId = sessionStorage.getItem("openId");
            if (this.openId == undefined || this.openId == null || this.openId == '') {
                uni.request({
                    url: this.baseUrl + '/OrdersPraise/open/auth',
                    // data: {
                    //   url: "https://api.xiongmaodangao.com/web/feedback/index.html",
                    //   uuid: sessionStorage.getItem("uuid"),
                    // },
                    data: {
                        url: window.location.href,
                        uuid: sessionStorage.getItem("uuid")
                    },
                    method: "GET",
                    success: (data)=> {
                        if(data.data.code == 200){
                            console.log(data.data.data.authUrl)
                            window.location = data.data.data.authUrl;
                        }
                    },
                    fail: ()=> {
                        uni.showModal({
                            title: '提示',
                            content: '请刷新页面重试, CODE_ERROR_1001',
                            showCancel: false,
                            success: (res)=> {
                                if (res.confirm) {
                                    // console.log('用户点击确定');
                                } else if (res.cancel) {
                                    // console.log('用户点击取消');
                                }
                            }
                        });
                    }
                });
            }
        } else {
            this.openId = sessionStorage.getItem("openId");
            this.nickName = sessionStorage.getItem("nickName");
            this.unionid = sessionStorage.getItem("unionid");
            if (this.openId == 'undefined' || this.openId == null || this.openId == '') {
                uni.request({
                    url: this.baseUrl + '/OrdersPraise/open/openid',
                    method: "GET",
                    data: {
                        code: code,
                        uuid: sessionStorage.getItem("uuid"),
                    },
                    success: (data)=> {
						// uni.showToast({
						// 	title: data.data,
						// 	duration: 10000
						// })
						// alert('code:'+code)
						// alert('openId:'+JSON.stringify(data.data.data.openId))
                        if (data.data.data.openId == '') {
                            window.location = window.location.href.split("?")[0];
                        } else {
                            console.log(data.data.data)
							// alert('data:' + JSON.stringify(data.data.data))
                            sessionStorage.setItem('openId', data.data.data.openId);
                            sessionStorage.setItem('nickName', data.data.data.user.nickname);
                            sessionStorage.setItem('unionid', data.data.data.user.unionid);
                            this.openId = data.data.data.openId;
                            this.nickName = data.data.data.user.nickname;
                            this.unionid = data.data.data.user.unionid;
							// alert('openId:' + sessionStorage.getItem('openId'))
                        }
                    },
                    fail: ()=> {
                        uni.showModal({
                            title: '提示',
                            content: '请刷新页面重试, CODE_ERROR_1003',
                            showCancel: false,
                            success: (res)=> {
                                if (res.confirm) {
                                    console.log('用户点击确定');
                                } else if (res.cancel) {
                                    console.log('用户点击取消');
                                }
                            }
                        });
                    }
                });
            }
        }

    },
    methods: {
        radioChange(n){
            console.log('选中',n)
            this.formData.sex = n
            this.sexBorder = false
            // console.log(this.formData.sex)
        },
        birthdayChange(e){
            // console.log(e)
            // console.log(this.formData.birthday)
            this.formData.birthday = e
            this.birthdayBorder = false
        },
        fromwhereChange(e) {
            // console.log('confirm', e)
            this.columnsIndex = e.target.value
            this.formData.fromwhere = this.columns[this.columnsIndex]
            this.fromwhereBorder = false
        },
        casenameChange(e){
            this.casenameListIndex = e.target.value
            this.formData.casename = this.casenameList[this.casenameListIndex]
            this.casenameBorder = false
        },
        motivenChange(e){
            this.motiveListIndex = e.target.value
            this.formData.motive = this.motiveList[this.motiveListIndex]
            this.motiveBorder = false
        },
        towhoChange(e){
            this.towhoListIndex = e.target.value
            this.formData.towho = this.towhoList[this.towhoListIndex]
            this.towhoBorder = false
        },
        submitInfo(){
            // console.log(this.formData.sex)
            if(this.formData.sex !=0 && this.formData.sex !=1) {
                console.log(this.formData.sex !=0)
                uni.showToast({
                    title: '请选择性别',
                    icon: 'none',
                    duration: 2000
                });
                this.sexBorder = true
                return
            }
            if(this.formData.birthday == '' || this.formData.birthday.lenght == 0) {
                uni.showToast({
                    title: '请选择生日日期',
                    icon: 'none',
                    duration: 2000
                });
                this.birthdayBorder = true
                return
            }
            // if(this.formData.fromwhere == '请选择' || this.columnsIndex == 0) {
            //     uni.showToast({
            //         title: '请选择从哪里听说熊猫不走的途径',
            //         icon: 'none',
            //         duration: 2000
            //     });
            //     this.fromwhereBorder = true
            //     return
            // }
            if(this.formData.casename == '请选择' || this.casenameListIndex == 0) {
                uni.showToast({
                    title: '请选择从哪里听说熊猫不走的途径',
                    icon: 'none',
                    duration: 2000
                });
                this.casenameBorder = true
                return
            }
            if(this.formData.motive == '请选择' || this.motiveListIndex == 0) {
                uni.showToast({
                    title: '请选择购买动机',
                    icon: 'none',
                    duration: 2000
                });
                this.motiveBorder = true
                return
            }
            if(this.formData.towho == '请选择' || this.towhoListIndex == 0) {
                uni.showToast({
                    title: '请选择蛋糕买给谁',
                    icon: 'none',
                    duration: 2000
                });
                this.towhoBorder = true
                return
            }
            uni.showLoading({
                title: '加载中'
            });
            this.saveForm()
        },
        getSessionId() {
            let getuuid = sessionStorage.getItem("uuid");
            console.log("sessionId:" + getuuid)
            if (getuuid == undefined || getuuid == null || getuuid === '') {
                getuuid = this.generateUUID();
                sessionStorage.setItem('uuid', getuuid);
            }
            console.log("sessionId:" + getuuid)
            return getuuid;
        },
        generateUUID() {
            let d = new Date().getTime();
            if (window.performance && typeof window.performance.now === "function") {
                d += performance.now(); //use high-precision timer if available
            }
            let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
                let r = (d + Math.random() * 16) % 16 | 0;
                d = Math.floor(d / 16);
                return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
            });
            return uuid;
        },
        GetQueryString(name) {
            let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            let r = window.location.search.substr(1).match(reg); //search,查询？后面的参数，并匹配正则
            if (r != null) return unescape(r[2]);
            return null;
        },
        saveForm(){
            let data = {
                "openId": this.openId ? this.openId : sessionStorage.getItem("openId"),
                "nickName": this.nickName ? this.nickName : sessionStorage.getItem("nickName"),
                "unionId": this.unionid === undefined ? null : this.unionid,
                "uuid": sessionStorage.getItem("uuid"),
                address: this.formData.address,
                sex: this.formData.sex,
                birthday: this.formData.birthday,
                fromwhere: this.formData.fromwhere == '其他'? this.formData.fromwhereOther : this.formData.fromwhere,
                casename: this.formData.casename == '其他'? this.formData.casenameOther : this.formData.casename,
                motive: this.formData.motive == '其他'? this.formData.motiveOther : this.formData.motive,
                // motiveOther: '',
                towho: this.formData.towho == '其他'? this.formData.towhoOther : this.formData.towho,
            }
			// alert('上传的data:' + JSON.stringify(data))
            // console.log(data)
            uni.hideLoading()
            uni.request({
                url: this.baseUrl + '/OrdersPraise/open/newsave',
                data: {
                    "openId": this.openId ? this.openId : sessionStorage.getItem("openId"),
                    "nickName": this.nickName ? this.nickName : sessionStorage.getItem("nickName"),
                    "unionId": this.unionid ? this.unionid : sessionStorage.getItem("unionid"),
                    "uuid": sessionStorage.getItem("uuid"),
                    address: this.formData.address,
                    sex: this.formData.sex,
                    birthday: this.formData.birthday,
                    fromwhere: this.formData.fromwhere == '其他'? this.formData.fromwhereOther : this.formData.fromwhere,
                    casename: this.formData.casename == '其他'? this.formData.casenameOther : this.formData.casename,
                    motive: this.formData.motive == '其他'? this.formData.motiveOther : this.formData.motive,
                    // motiveOther: '',
                    towho: this.formData.towho == '其他'? this.formData.towhoOther : this.formData.towho,
                },
				header: {
					'Content-Type':'application/x-www-form-urlencoded'
				},
                method: "POST",
                success: (data)=> {
                    uni.hideLoading()
					// alert(JSON.stringify(data.data))
                    if (data.data.code == 200) {
                        uni.showToast({
                            title: '提交成功！',
                            icon: 'success',
                            duration: 2000
                        });
                        setTimeout(()=>{
                            window.location = 'https://shop19559733.youzan.com/wscump/coupon-pack/fetch?alias=7txwv9qj&kdtId=19367565&shopAutoEnter=1'
                        },2000)
                    } else {
                        uni.showToast({
                            title: '提交失败请刷新页面，重新提交',
                            icon: 'error',
                            duration: 2000
                        });
                    }
                },
                fail: (err) =>{
                    uni.hideLoading()
                    uni.showToast({
                        title: '提交失败请刷新页面，重新提交',
                        icon: 'error',
                        duration: 2000
                    });
                }
            });
        },
        //获取经纬度
        getLL(){
            uni.getLocation({
				type: 'gcj02',
				success: (res)=> {
					// alert(JSON.stringify(res))
					this.longitude = res.longitude
					this.latitude = res.latitude
					this.getMapAredss()
				}
			});
        },
        //获取地理位置
        getMapAredss(){
			// let _this = this
			this.qqMap.reverseGeocoder({
				location: {
					latitude: this.latitude,
					longitude: this.longitude
				},
				success: (res)=>{
					// console.log(res.result.address_component)
					if(res.message=='query ok'){
                        let a = res.result.address_component
						this.address = res.result.address
						this.city = a.province + a.city + a.district
                        this.formData.address = this.city
                        // console.log(this.formData.address)
					}
				}
			})
		},
    },
};
</script>

<style lang='scss'>
body,
html {
    height: 100%;
    -webkit-tap-highlight-color: transparent;
    background: #efefef;
}

input,
input::placeholder {
    font-size: 16px;
    color: #666666;
}

.content {
    margin-top: -10px;
    padding-top: 5px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding-left: 10px;
    padding-right: 10px;
    background: #efefef;
}

.bg-bar {
    background-color: #d51717;
    height: 10px;
}

.demos-title {
    background-color: #d51717;
    text-align: center;
    font-size: 34px;
    color: #3cc51f;
    font-weight: 400;
    background-size: 100% 100%;
}

.demos-sub-title {
    text-align: left;
    color: rgba(69, 90, 100, 0.6);
    font-size: 14px;
}

.demos-header {
}

.demos-content-padded {
    padding: 15px;
}

footer {
    text-align: center;
    font-size: 14px;
    padding: 20px;
}

footer a {
    color: #999;
    text-decoration: none;
}

.logo {
    height: 88px;
    overflow: hidden;
}

.logo .img {
    width: 250px;
    margin: 0 auto;
    margin-top: 25px;
}

.van-uploader__input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    cursor: pointer;
    opacity: 0;
}

.activeImg {
    left: 0;
    right: 0;
    width: 100px;
    height: 100px;
    display: block;
    text-align: center;
    line-height: 100px !important;
}

#ordNo::placeholder {
    font-size: 11px;
    padding-top: 5px;
}


.relationship {
    -webkit-user-select: none;
}

.text-small {
    color: hotpink;
    font-size: 12px;
}

/*改写边框及横线*/
.weui-cells {
    border-radius: 10px;
    font-size: 19px;
}

.weui-cells:after,
.weui-cells:before {
    position: fixed;
}

.weui-cell:before {
    left: 0;
}

::v-deep .u-form-item {
    padding: 0 25px;
    position: relative;
    font-size: 15px ;

    .u-form-item__body__left__content__label {
        font-size: 16px ;
    }
    
    .u-radio{
        padding-right: 20px;
    }
    .Micon{
        position: absolute;
        left: 1px;
        top: 32%;
        color: #d51717;
    }
    .pickerTextNo{
        color: rgb(192, 196, 204) ;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .pickerText{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .picker{
        width: 100%;
    }
}
::v-deep .u-form-item__body__right{
    padding-left: 20px
}
.input-disabled{
    color: #7F7F7F;
}
.sexBorder{
    border: 1px solid #d51717;
    height: 100%;
}

.birthdayBorder{
    border: 1px solid #d51717;
    height: 100%;
}
.fromwhereBorder{
    border: 1px solid #d51717;
    height: 100%;
}
.casenameBorder{
    border: 1px solid #d51717;
    height: 100%;
}
.motiveBorder{
    border: 1px solid #d51717;
    height: 100%;
}
.towhoBorder{
    border: 1px solid #d51717;
    height: 100%;
}
::v-deep .uni-date-x{
    padding: 0;
}
::v-deep .uni-date__x-input{
    height: 31px;
}
/*改写cell样式*/
.weui-cell {
    padding: 10px;
}

.weui-cell__hd,
.weui-cell__hd {
    font-size: 16px !important;
}

/*改写上传框样式*/
.weui-uploader__input-box {
    background: url("../../static/camara-icon.png") no-repeat left 50% top 50%;
    border-width: 2px;
    border-color: #dfdfdf;
    border-style: dashed;
    border-radius: 3px;
}

.weui-uploader__input-box:after,
.weui-uploader__input-box:before {
    width: 0;
}

.weui-btn_primary {
    background: #d51717;
    width: 90%;
}

.weui-icon-info {
    color: #dfdfdf;
}

.title-bar {
    display: flex;
    padding: 10px;
    align-items: center;
}

.title-bar .title {
    color: #d51717;
    margin-left: 10px;
}

.title-bar .tip {
    height: 15px;
    padding: 2px 5px;
    font-size: 12px;
    color: #ffffff;
    margin-left: 10px;
    background: #d51717;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    line-height: 15px;
}
.bottom{
    padding:0px 20px 50px 20px;
    margin-top: 23px;
}
</style>
